<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<base th:href="@{/}">
	<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="css/font-awesome.min.css">
	<link rel="stylesheet" href="css/login.css">
	<script src="jquery/jquery-2.1.1.min.js"></script>
	<script src="bootstrap/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="layer/layer.js"></script>
	<script type="text/javascript">
		$(function () {
			$("#sendShortMessageBtn").click(function () {

				// 1.获取接受短信的手机号
				let phoneNum =	$.trim($("[name=phoneNum]").val());
				if(phoneNum == null || phoneNum == ""){
					layer.msg("请输入手机号！")
					return ;
				}else if(phoneNum.length != 11){
					layer.msg("请输入正确格式的手机号！");
					return ;
				}

				// 2.发送验证码请求
				$.ajax({
					url:"auth/member/send/short/message",
					type:"post",
					data:{
						"phoneNum":phoneNum
					},
					dataType:"json",
					success:function (res) {
						if(res.statue == "success"){
							layer.msg("发送成功!");
						}else {
							layer.msg("发送失败"+res.message);
						}

					},
					error:function (res) {
						layer.msg(res.status+".发送失败！."+res.statusText);

					}
				});


			});

		});
	</script>

</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
	<div class="container">
		<div class="navbar-header">
			<div><a class="navbar-brand" href="index.html" style="font-size:32px;">尚筹网-创意产品众筹平台</a></div>
		</div>
	</div>
</nav>

<div class="container">

	<form action="auth/do/member/register" method="post" class="form-signin" role="form">
		<h2 class="form-signin-heading"><i class="glyphicon glyphicon-log-in"></i> 用户注册</h2>
		<p th:text="${message}"> </p>
		<div class="form-group has-success has-feedback">
			<input type="text" name="loginAcct" class="form-control" th:value="${param.loginAcct}" placeholder="请输入登录账号" autofocus>
			<span class="glyphicon glyphicon-user form-control-feedback"></span>
		</div>
		<div class="form-group has-success has-feedback">
			<input type="password" name="userPswd" class="form-control" th:value="${param.userPswd}" placeholder="请输入登录密码" style="margin-top:10px;">
			<span class="glyphicon glyphicon-lock form-control-feedback"></span>
		</div>
		<div class="form-group has-success has-feedback">
			<input type="text" name="userName" class="form-control" th:value="${param.userName}" placeholder="请输入用户名" style="margin-top:10px;">
			<span class="glyphicon glyphicon glyphicon-envelope form-control-feedback"></span>
		</div>
		<div class="form-group has-success has-feedback">
			<input type="text" name="email" class="form-control" th:value="${param.email}"  placeholder="请输入邮箱地址" style="margin-top:10px;">
			<span class="glyphicon glyphicon glyphicon-envelope form-control-feedback"></span>
		</div>
		<div class="form-group has-success has-feedback">
			<input type="text" class="form-control" name="phoneNum" th:value="${param.phoneNum}" placeholder="请输入手机号" style="margin-top:10px;">
			<span class="glyphicon glyphicon glyphicon-earphone form-control-feedback"></span>
		</div>
		<div class="form-group has-success has-feedback">
			<input type="text" name="code" class="form-control" phoneNum id="inputSuccess4" placeholder="请输入验证码" style="margin-top:10px;">
			<span class="glyphicon glyphicon glyphicon-comment form-control-feedback"></span>
		</div>
		<button type="button"  id="sendShortMessageBtn" class="btn btn-lg btn-success btn-block"> 获取验证码</button>
		<button type="submit" class="btn btn-lg btn-success btn-block"> 注册</button>
	</form>
</div>

</body>
</html>